@charset 'utf-8';
@import 'common';

.middle {
    width: 900px;
    margin: 50px auto;
}

.container {
    position: relative;
    width: 340px;
    height: 0;
    border: 1px solid #9ac1c0;
    margin: 0 auto;

    .title {
        width: 135px;
        height: 30px;
        line-height: 15px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background: #fff;
        padding: 0 15px;
        font-weight: bold;
        text-transform: uppercase;
        text-align-last: justify;
        font-family: $font;

        h3 {
            font-size: 14px;
            padding-bottom: 3px;
        }

        p {
            font-size: 9px;
            font-family: "Arial";
            color: rgb(61, 61, 61);
        }

    }
}

// 注册表单
.register-form {
    font-family: $font;
    font-size: 14px;
    margin-top: 45px;
    text-align: center;
    @include reuse-flex(column);
    align-items: center;

    form {
        // width: 750px;
        margin-top: 30px;

        table {
            tr {
                display: table-row;
                text-align: left;

                td:nth-child(2) {
                    text-align: left;
                    padding-left: 15px;
                }

                .sex {
                    text-align: left;
                }

                td {
                    display: table-cell;
                    vertical-align: middle;
                    /*定义行内元素垂直对齐*/
                    height: 40px;

                    label {
                        width: 70px;
                        display: inline-block;
                    }


                    input,
                    select {
                        width: 210px;
                        height: 20px;
                        border: 1px solid #9ac1c0;
                        outline: none;
                        line-height: 18px;
                        padding-left: 15px;
                        box-sizing: border-box;
                    }

                    select {
                        color: #acacac;
                    }


                    .radio {
                        border-width: 1px;
                        border-color: rgb(93, 142, 190);
                        border-style: solid;
                        border-radius: 50%;
                        background-color: rgb(229, 229, 229);
                        width: 7px;
                        height: 7px;
                    }

                }

                // 验证码
                .verification {
                    input {
                        width: 63px;
                    }

                    img {
                        margin: 0 5px;
                        vertical-align: middle;
                    }

                    span {
                        margin: 0 3px;
                    }

                    .change {
                        color: #b30000;
                        cursor: pointer;
                    }

                }

                // 会员
                .vip {
                    .textarea {
                        display: flex;

                        label {
                            display: inline-block;
                            width: 115px;
                        }

                        textarea {
                            width: 524px;
                            height: 116px;
                            border: 1px solid #9ac1c0;
                            resize: none;
                            outline: none;
                            text-align: left;
                            font-size: 12px;
                            padding: 10px;
                            font-family: "Microsoft YaHei";
                            text-align: justify;
                            text-align-last: justify;
                            box-sizing: border-box;
                            overflow: hidden;
                        }
                    }

                    // 协议勾选
                    .checkbox {
                        padding: 10px 0 0 115px;

                        input {
                            width: 15px;
                            height: 13px;
                        }

                        span {
                            font-size: 12px;
                        }

                    }



                }

                // 按钮
                .btn {
                    text-align: center;

                    button {
                        border-radius: 5px;
                        background-color: rgb(109, 182, 255);
                        width: 121px;
                        height: 33px;
                        line-height: 33px;
                        border: none;
                        margin-top: 30px;
                        cursor: pointer;
                    }

                }

                // *
                .sign {
                    color: red;
                }
            }
        }
    }
}